<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jquery queue</title>
	<script src="framework/jquery-1.10.2.min.js"></script>
	<script>
		var content = "javascript is a good language!!";
		$(function(){
			function callback(){
				console.log(this);
			}

			function notify(word){
				console.log("notify:" + word);
				$("#content").append(word);
			}

			var arr = content.split(' ');

			$.each(arr,function(index,item){
				for(var i=0; i<item.length; i++) {
					// console.log(i + " !!i = " + (!!i) + (!i));
					(function(word){
						$("#content").queue("dynamicStyle", function(next){
							callback.call($(this));
							notify(word);
							next();
						}).delay(200,"dynamicStyle");
					})(item[i]);
				}
				$("#content").queue("dynamicStyle", function(next){
							callback.call($(this));
							notify("&nbsp;");
							next();
				}).delay(200,"dynamicStyle");
				
			});

			

			$("#content").dequeue("dynamicStyle");
		});
	</script>
</head>
<body>
	<div id="content"></div>
</body>
</html>